<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="../../v2/common/jspcommon.jsp"%>
<%@include file="../common/jscss.jsp"%>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>添加新文稿</title>
<style type="text/css">
.l-table-edit {
	font-size: 12px;
	margin: auto;
	width: 100%;
	border-collapse: collapse;
}

.l-table-edit td {
	padding: 4px;
	border: 1px solid #336699;
}
</style>
</head>

<table class="l-table-edit">
	<tr>
		<td width=33%>文稿标题</td>
		<td width=66%>
		<input type="text" id="title" style="width: 450px;" value="${discuss.title }"/>
		<input type="text" id="identifier" style="width: 450px; display: none;" value="${discuss.identifier }" />
		</td>
	</tr>

	<tr>
		<td>文稿标题图片</td>
		<td><img id="titlePic" width="100" height="100" src="${discuss.titlePic }">
			<form enctype="multipart/form-data" method="post"
				action="/misc/discuss/uploadImg.htm" id="form_title">
				<input type="file" onchange="uploadImg();return false;"
					style="width: 200px;" title="支持jpg、jpeg、gif、png格式，文件小于2M"
					name="image" id="image" />
			</form>
		</td>
	</tr>
	<tr>
		<td>作者</td>
		<td style="display: none;"><input type="text" id=creator value="${discuss.creator}"/></td>
	</tr>
	
	<tr>
		<td>正文</td>
		<td><textarea id="add_content" name="add_content" style="width: 650px;" >${discuss.content}</textarea>
	    </td>
	</tr>
	<tr>
	
		<td><input type="checkbox" class="" onclick="themeRadioShow()" name="themeRadioShow"/> 关联主题</td>
		<td id="themeRadio" style="display: none;"> 
			
			<input type="radio" name="RadioGroup3" value="01"  id="RadioGroup3_0" onclick="prodcutRadio();"/>图片
			<input type="radio" name="RadioGroup3" value="02" id="RadioGroup3_0"  onclick="prodcutRadio();"/>商品
	    </td>
	</tr>
	<tr id="pictorialName" style="display: none;">
	
		<td>商品画报标题</td>
		<td > 
			<input type="text" id="picTitle" />
	    </td>
	</tr>
	<tr>
		<td>是否可以回复</td>
		<td><input type="radio" name="RadioGroup1" value="true" id="RadioGroup1_0" />可以 
			<input type="radio" name="RadioGroup1" value="false" id="RadioGroup1_0" />不可以
		</td>
	</tr>
	<tr>
		<td>回复是否可以回复图片</td>
		<td><input type="radio" name="RadioGroup2" value="true"  id="RadioGroup2_0" />可以 
			<input type="radio" name="RadioGroup2" value="false" id="RadioGroup2_0" />不可以
		</td>
	</tr>
	<tr style="text-align: center;">
		<td colspan="2">
			<c:if test="${discuss.identifier ==null}">
				<input type="button" id="saveDis" value="创建新文稿" onclick="saveDis();" />
			</c:if>
			<c:if test="${discuss.identifier !=null}">
				<input type="button" id="saveDis" value="更新文稿" onclick="updateDis();" />
			</c:if>
		</td>
	</tr>
</table>


<script type="text/javascript">
	var content_editor;
	$(function() {
		//初始化富文本框
		var toolbars = [ [ 'FullScreen', 'Source', 'Link', 'Unlink', 'Preview',
				'InsertImage', 'Emotion', 'Spechars', 'Bold', 'Italic',
				'Underline', 'StrikeThrough', 'ForeColor', 'BackColor',
				'JustifyLeft', 'JustifyCenter', 'JustifyRight',
				'JustifyJustify', 'Paragraph', 'FontFamily', 'FontSize',
				'ImageNone', 'ImageLeft', 'ImageRight', 'ImageCenter' ] ];
		var initialStyle = 'body{font-family:"宋体";font-size:12px;}';
		var initArgus = {
			toolbars : toolbars,
			wordCount : false,
			minFrameHeight : 150,
			initialStyle : initialStyle,
			elementPathEnabled : false
		}

		content_editor = new baidu.editor.ui.Editor({
			toolbars : toolbars,
			wordCount : false,
			minFrameHeight : 150,
			initialStyle : initialStyle,
			elementPathEnabled : false,
			textarea : 'add_content'
		});
		content_editor.render("add_content");
	});
	//上传图片
	function uploadImg() {
		var filepath = $("#image").val();
		var extStart = filepath.lastIndexOf(".");
		var ext = filepath.substring(extStart, filepath.length).toUpperCase();
		if (ext != ".PNG" && ext != ".JPG" && ext != ".JPEG" && ext != ".GIF") {
			alert("图片限于png,jpeg,jpg,gif格式");
			return;
		}
		$("#form_title").ajaxSubmit({
			dataType : 'json',
			cache : false,
			success : function(data) {
				$("#titlePic").attr("src", data.imageServer + data.original);
			},
			error : function(err) {
				alert(err);
			}
		});
		return false;
	}
	//保存
	function saveDis() {
		
		var isReply = $(":radio[name='RadioGroup1'][checked]").val();
		var isReplyPic = $(":radio[name='RadioGroup2'][checked]").val();
		var themeStyle = $(":radio[name='RadioGroup3'][checked]").val();
		var title = $("#title").val();
		var content = content_editor.getContent();
		//主题
		 $(":checkbox[name='themeRadioShow']").each(function() {
					if ($(this).attr("checked")) {
						if (themeStyle == null) {
							alert("请选择主题的类型");
							return;
						}
					}
				});
		if (isReply == null || isReplyPic == null) {
			alert("请选择是否可以回复|是否可以回复图片|主题的类型");
			return;
		} else if (IsNull(title)) {
			alert("标题不能为空");
		} else if (title.length > 50) {
			alert("标题太长了");
		} else {
			$("#saveDis").attr("onclick", "");
			$.post("/misc/discuss/savedis.htm", {
				'title' : title,
				'titlePic' : $("#titlePic").attr("src"),
				'creator' : $("#creator").val(),
				'visitAmout' : $("#visitAmout").val(),
				'replyAmout' : $("#replyAmout").val(),
				'isReply' : isReply,
				'isReplyPic' : isReplyPic,
				'theme': themeStyle,
				'picTitle':$("#picTitle").val(),
				'content' : content
			}, function(data) {
				parent.grid_ae.loadData();
			});
		}
	}
	//更新
	function updateDis() {
		var isReply = $(":radio[name='RadioGroup1'][checked]").val();
		var isReplyPic = $(":radio[name='RadioGroup2'][checked]").val();
		var title = $("#title").val();
		var content = content_editor.getContent();
		if (isReply == null || isReplyPic == null) {
			alert("请选择是否可以回复");
			return;
		} else if (IsNull(title)) {
			alert("标题不能为空");
		} else if (title.length > 50) {
			alert("标题太长了");
		} else {
			$("#saveDis").attr("onclick", "");
			$.post("/misc/discuss/updatedis.htm", {
				'identifier':$("#identifier").val(),
				'title' : title,
				'titlePic' : $("#titlePic").attr("src"),
				'creator' : $("#creator").val(),
				'visitAmout' : $("#visitAmout").val(),
				'replyAmout' : $("#replyAmout").val(),
				'isReply' : isReply,
				'isReplyPic' : isReplyPic,
				'theme': $("#theme").val(),
				'content' : content
			}, function(data) {
				parent.grid_ae.loadData();
			});
		}
	}
	function themeRadioShow(){
			 $(":checkbox[name='themeRadioShow']").each(function() {
					if ($(this).attr("checked")) {
						$("#themeRadio").show();
					}else{
						$("#themeRadio").hide();
					}
				});
	}
	
	function prodcutRadio(){
		//主题是否商品
		var themeStyle = $(":radio[name='RadioGroup3'][checked]").val();
		if(themeStyle=='02'){
			$("#pictorialName").show();
		}else{
			$("#pictorialName").hide();
		}
	}
</script>
